<template>
  <ych-modal
    :fullscreen="true"
    :visible="editIndexModal"
    :closable="false"
    :body-style="bodyStyle"
    :destroy-on-close="true"
    wrap-class-name="table-modal-wrap"
    :ok-text="$t('m.common.button.save')"
    :footer="null"
    @ok="savePortalDesign"
    @cancel="closeModal"
  >
    <div class="modal-body">
      <AsyncComponent
        :widget-form="widgetForm"
        :path="comPath"
        :port-let="portLet"
        :delay="delay"
        @updateDesign="updateDesign"
        @updatePortLetList="updatePortLetList"
        @closeModal="closeModal"
        @savePortalDesign="savePortalDesign"
      />
    </div>
  </ych-modal>
</template>

<script>

  import AsyncComponent from '@/framework/FormMaking/components/AsyncComponent';
  import { httpAction } from '@/api/manage'
  import { message } from 'ant-design-vue';
  import YchConstant from "@/api/YchConstant";

  export default {
    props:['widgetForm','portLet','updateSelfPortletUrl'],
    name: "PortalConfigDesign",
    components:{
      AsyncComponent
    },
    data(){
      return{
        comPath:"framework/FormMaking/entry",
        portalDesignData: null,
        editIndexModal:true,
        defaultWidgetForm: {
          list: [
          ],
          config: { labelWidth: 100, labelPosition: 'right', size: 'small' }
        },
        updateForPortletUrl:YchConstant.PREFIX_SYSTEM + '/portlet/updatePortlet',
        spinning:true,
        delay:0,
        bodyStyle: {
          // 弹窗body宽高控制
          backgroundColor: '#fff',
          padding: 0,
          borderRadius: 4
        }
      }
    },
    methods:{
      updateDesign(data) {
        this.portalDesignData = data
      },
      savePortalDesign(){
        if(this.portalDesignData && this.portLet.id){
          let param = {
            "id" : this.portLet.id,
            "content" : JSON.stringify(this.portalDesignData ),
            "portletCode":this.portLet.portletCode,
            "portletName" : this.portLet.portletName
          }
          if(this.updateSelfPortletUrl!=null && this.updateSelfPortletUrl!=""){
            this.updateForPortletUrl = this.updateSelfPortletUrl
          }
          httpAction(this.updateForPortletUrl,param, 'post').then(res => {
            if (res.success) {
              this.$emit('updatePortLetList')
              this.closeModal()
              message.success(this.$t('m.eform.formDesign.label.bao-cun-cheng-gong'));
            }else{
              this.$emit('closeModal')
              message.warning(this.$t('m.portalDesign.description.bao-cun-shi-bai'));
            }
          }).catch(response => {

          });
        }
      },
      closeModal() {
        // 返回关闭事件
        this.editIndexModal = false
        this.$emit('closeModal')
      },
      updatePortLetList(){
        this.closeModal()
        this.$emit('updatePortLetList')
      }
    }
  }
</script>
<style lang="less" scoped>
.modal-body {
  height: 100%;
  width: 100%;
}
.table-modal-wrap {
  overflow: hidden !important;
}
</style>
